<!-- 任务类型页面 -->

<div class="container" :important="taskType">

    <!--handle area-->
    <div class="row handler">

        <span><i style="font-size: 15px" class="iconfont">&#xe601;</i>功能模块</span>
        <hr>

        <div class="btnBlock" type="f" data-toggle="modal" data-target="#addTaskTypeModal">
            <div>
                <i class="iconfont">&#xe617;</i><span style="vertical-align: super;">新增任务类型</span>
            </div>
        </div>

        <br>
        <span><i style="font-size: 15px" class="iconfont">&#xe6d6;</i>列表展示</span>
        <hr>
    </div>

    <!-- data area -->

    <div class="row data">
        <div>
            <table id="taskTypeTable"
                   data-show-export="true"
                   data-detail-formatter="detailFormatter"
                   data-minimum-count-columns="2"
                   data-pagination="true"
                   data-id-field="id"
                   data-page-list="[10, 25, 50, 100, ALL]"
                   data-show-footer="false"
                   data-side-pagination="client"
                   data-click-to-select="true"
                   data-page-number="1" data-page-size="5">
                <thead>
                <tr>
                    <th data-field="state" data-radio="true"></th>
                    <th data-field="taskTypeName" data-sortable="true" >任务类型名称</th>
                    <th data-field="taskTypeDES" data-sortable="true" >任务描述</th>
                    <th data-field="createTime" data-sortable="true" >创建时间</th>
                </tr>
                </thead>
            </table>
        </div>
    </div>




    <!-- add task type modal -->
    <div class="modal fade" id="addTaskTypeModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h5 class="modal-title" id="exampleModalLabel"><i style="font-size: 15px;margin: 0 10px;" class="iconfont">&#xe64c;</i>新增任务类型</h5>
                </div>
                <div class="modal-body">
                    <div>
                        <div class="row form-group">
                            <label for="recipient-name" class="col-sm-2 col-sm-offset-1">类型名称:</label>
                            <input type="text" class="col-sm-8" id="recipient-name" :duplex="@add.name">
                            <span class="col-sm-1 tip">*</span>
                        </div>
                        <div class="row form-group">
                            <label for="message-text" class="col-sm-2 col-sm-offset-1">类型描述:</label>
                            <textarea style="resize: none;height: 100px;min-height: 100px" class="col-sm-8" id="message-text" :duplex="@add.note"></textarea>
                            <span class="col-sm-1 tip">*</span>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" :click="@confirmAdd">提交</button>
                </div>
            </div>
        </div>
    </div>



    <!-- loding modal -->
    <div class="modal fade" id="taskTypeLoading" tabindex="-1" role="dialog" aria-labelledby="lodaingModal">
        <div class="modal-dialog" role="document">
            <div class="modal-content">

                <div class="modal-body">
                    loading....
                </div>

            </div>
        </div>
    </div>


</div>